<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	template="../Template/Template.xhtml"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:rich="http://richfaces.org/rich">


	<ui:define name="title">
    Trang giỏ hàng
  	</ui:define>


	<ui:define name="content">

		<h:outputScript library="js" name="TrangGioHang.js" target="head" />

		<!-- Content -->
		<div id="MainPanel" align="left">
			<div class="ContentPart">
				<h1 class="ContentPartTitle" align="center">TRANG GIỎ HÀNG</h1>
			</div>
			<!-- <h:form name="gioHang" action="" method="post"> -->

			<h:panelGroup rendered="#{not taiKhoanDangNhapBean.daDangNhap}">
				<div class="ContentPart">
					<h3 class="ContentPartHeader">THÔNG TIN NGƯỜI ĐẶT HÀNG</h3>
					<div class="ContentPartContent">
						<p class="mediumSize">
							Bạn chưa
							<h:link outcome="TrangDangNhap?faces-redirect=true">đăng nhập</h:link>
							. Vui lòng
							<h:link outcome="TrangDangNhap?faces-redirect=true">Đăng nhập</h:link>
							để tiếp tục. <br /> Hoặc
							<h:link outcome="TrangDangKy?faces-redirect=true">Đăng ký</h:link>
							nếu chưa có tài khoản
						</p>
						<div class="ContentPart" align="right">
							<h:commandButton process="@this" immediate="true"
								class="buttonLink button" action="TrangChu"
								value="Trở lại Trang chủ" />
						</div>

					</div>
				</div>


			</h:panelGroup>

			<h:panelGroup rendered="#{taiKhoanDangNhapBean.daDangNhap}">
				<div class="ContentPart">
					<h3 class="ContentPartHeader">THÔNG TIN GIỎ HÀNG</h3>

					<h:panelGroup id="tableContent">
						<h:dataTable value="#{gioHangBean.lstSanPham}" var="sp"
							styleClass="tableDulieu"
							rendered="#{not empty gioHangBean.lstSanPham}"
							rowClasses="rowLe,rowChan">

							<ui:param name="index"
								value="#{gioHangBean.lstSanPham.indexOf(sp)}" />

							<h:column>
								<f:facet name="header">STT</f:facet>
							#{index + 1}							 		
						</h:column>
							<h:column>
								<f:facet name="header">TÊN SẢN PHẨM</f:facet>
								<h:commandLink action="#">#{sp.tensanpham}</h:commandLink>
							</h:column>
							<h:column>
								<f:facet name="header">SỐ LƯỢNG</f:facet>
								<h:inputText value="#{sp.soluongtronggiohang}"></h:inputText>
							</h:column>
							<h:column>
								<f:facet name="header">GIÁ BÁN</f:facet>
								<h:outputText value="#{sp.giaban}">
									<f:convertNumber groupingUsed="true" pattern="#0,000" />
								</h:outputText>
							</h:column>
							<h:column>
								<f:facet name="header">THÀNH TIỀN</f:facet>
								<h:outputText value="#{sp.giaban * sp.soluongtronggiohang}"
									styleClass="tien-te">
									<f:convertNumber groupingUsed="true" pattern="#0,000" />
								</h:outputText>
							</h:column>
							<h:column>
								<f:facet name="header">XÓA</f:facet>
								<h:commandButton class="deleteIcon no-border pointerCursor"
									process="@this" immediate="true"
									action="#{gioHangBean.XoaSanPham(sp.masanpham)}" />
							</h:column>
						</h:dataTable>
					</h:panelGroup>
					<!-- </form> -->
				</div>
				<div class="ContentPartContent" align="right">
					<h:dataTable align="right">
						<h:column>
							<f:facet name="header">Tổng thành tiền</f:facet>
						</h:column>
						<h:column>
							<f:facet name="header">
								<div style="width: 200px; display: inline-block;" align="right">
									<strong><font color="#FF0000"> <h:outputText
												value="#{gioHangBean.TinhTongTien()}">
												<f:convertNumber groupingUsed="true" pattern="#0,000" />
											</h:outputText> VNÐ
									</font></strong>
								</div>
							</f:facet>
						</h:column>
					</h:dataTable>
					<h:commandButton class="buttonLink button" action="TrangGioHang"
						value="Cập nhật">
						<!-- <f:ajax render="tableContent" /> -->
					</h:commandButton>
				</div>
				<div class="ContentPart">
					<h3 class="ContentPartHeader">THÔNG TIN NGƯỜI ĐẶT HÀNG</h3>
					<div class="ContentPartContent">
						<div class="ins">Tên người đặt:</div>
						<div class="info" id="tenNguoiDat">
							#{taiKhoanDangNhapBean.taiKhoan.hoten}</div>
						<div class="ins">Email:</div>
						<div class="info" id="email">#{taiKhoanDangNhapBean.taiKhoan.email}</div>
						<div class="ins">Địa chỉ:</div>
						<div class="info" id="diaChi">#{taiKhoanDangNhapBean.taiKhoan.diachi}</div>

					</div>
				</div>
				<div class="ContentPart">
					<h3 class="ContentPartHeader">THÔNG TIN NGƯỜI NHẬN HÀNG</h3>
					<div class="ContentPartContent">

						<div class="ins">Địa chỉ người nhận:</div>
						<!-- <input class="txtField" type="text" id="txtDiaChiNguoiNhan"
									size="auto" value="212/25 Đoàn Văn Bơ, P10, Quận 4" /> -->
						<h:inputText id="txtDiaChiNguoiNhan" class="txtField"
							value="#{gioHangBean.diaChiNguoiNhan}" />
						<br />
					</div>
				</div>
				<br />
				<div class="ContentPart" align="right">

					<!-- <a class="buttonLink" href="TrangGioHang.do?action=TiepTucMua">
								<div class="button">Tiếp tục mua</div>
							</a> <input type="submit" name="btCapNhat" class="button buttonLink"
								value="Cập Nhật"></input><input type="hidden" name="action"
								value="CapNhat" /> <a class="buttonLink">
								<div class="button" onclick="KiemTraGioHang()">Đặt hàng</div>
							</a> -->
					<h:commandButton process="@this" immediate="true"
						class="buttonLink button" action="TrangChu" value="Tiếp tục mua" />

					<h:commandButton class="buttonLink button"
						action="#{gioHangBean.ThucHienDatHang()}" value="Đặt hàng" />
					<!-- <h:commandButton process="@this" immediate="true"
						class="buttonLink button" action="#{gioHangBean.ThemSanPham(11)}"
						value="Thêm SP" /> -->
				</div>
			</h:panelGroup>
			<!-- </h:form> -->
		</div>
		<!-- Content -->
	</ui:define>
</ui:composition>